import './checkProof.less'

import React, { useState } from 'react';
import { Select, Space, InputNumber, Input } from 'antd';

import { BorderOuterOutlined } from '@ant-design/icons';

import Table2 from '../proofModule/table2';
import ProjectName from '../proofModule/projectName'


function CheckProof() {
    
    const font = [];
    font.push(
        { value: 'rember', label: '记' },
        { value: 'incCome', label: '收' },
        { value: 'pay', label: '付' },
        { value: 'turn', label: '转' }
    );
    const handleChange = (value: string) => {
        console.log(`selected ${value}`);
    };


    const getNum = 5;
    const getProofNum: number = Number(getNum);
    const proofNum: number = Number(getProofNum + 1);

    const getDate = '2023-9-6';
    const getProofDate: string = String(getDate);
    const proofDate: string = String(getProofDate);
    const suffix = (
        <BorderOuterOutlined
            style={{
                fontSize: 16,
                color: '#1677ff',
            }}
        />
    );

    const getMoreFile = ['', '', '', '', ''];
    const getProofFile: number = Number(getMoreFile.length);
    const moreFileNum: number = Number(getProofFile);

    const creator=[];
    const getCreator=('Phoebe');
    creator.push(getCreator)

    return (
        <>
        <div className='page'>
            <div className='header'>
                <div className="title">
                    <span>记账凭证</span>
                    <div className='bom'></div>
                </div>
                <div className="goBack">
                    返回
                </div>
            </div>
            <div className='header2'>
                <div className='proofInfo1'>
                    <Space wrap>
                        <Select
                            defaultValue="rember"
                            style={{ width: 85 }}
                            onChange={handleChange}
                            options={font}
                        />
                    </Space>
                    <div><InputNumber disabled={true} value={proofNum} style={{ color: 'black', width: '50px', textAlign: 'center', marginLeft: '20px' }} />号</div>
                    <div style={{ padding: 0, width: '150px' }}><span>日期:</span>
                        <Input value={proofDate} disabled={true} style={{ width: 100, color: 'black' }} />
                        <BorderOuterOutlined style={{ zIndex: 9, marginLeft: '-20px' }} />
                    </div>
                    <div style={{ marginLeft: '20px' }}>附单据:
                        <Input value={moreFileNum} disabled={true} style={{ width: 50, color: 'black', textAlign: 'center' }} />&nbsp;张&nbsp;<span style={{ color: '#00C48F' }}>添加附件</span>
                    </div>
                </div>
                <div className="operate">
                    <div className="btn">审核</div>
                    <div className="btn">保存</div>
                    <div className="btn">打印</div>
                    
                </div>
            </div>
            <Table2></Table2>
            <div className="footer">
                <div className='people'>
                    制单人:&nbsp;{creator}
                </div>
            </div>
        <ProjectName/>
        </div>
        </>
    )
}
export default CheckProof